window.addEventListener("load", function () {
	//1.获取后天数据,进行遍历
	const apiData = [
		{"times": 4000, "price": 1200, "unitPrice": "0.3000"},
		{"times": 8000, "price": 2000,"unitPrice": "0.2500" },
		{"times": 40000, "price": 8000, "unitPrice": "0.2000" }
	   ]
	   //2.遍历时拼接为HTML的结构
	   apiData.forEach(function(v){
		 //3.将拼接好的结构放入指定位置
		 $('.righttextfove').innerHTML +=`<span data-price=${v.price} data-unitPrice=${v.unitPrice}>${v.times}次</span>`
	   });
	   //给默认的第一个添加激活样式
	//    console.log($(".righttextfove span")[3]);
	   $(".righttextfove span")[3].classList.add('active');
	   $('.righttextfix').innerHTML=`<span>￥${$(".righttextfove span")[3].dataset.price}</span>
				(约${$(".righttextfove span")[3].dataset.unitprice}元/次),仅限企业实名购买`
  






	// 功能一:给tab添加激活样式
	//1.获取相关节点

	$(".righttextfove span").forEach(function (v) {
		//2.给#righttextfove的span绑定点击事件
		v.addEventListener("click", function () {
			//4.在给自己添加对应的激活方式
			if (!this.classList.contains("default")) {
				//3.先给span进行排他.将他的样式全部都清除
				$(".righttextfove span").forEach(function (item) {
					item.classList.remove("active");
				});
				this.classList.add("active");
				$('.righttextfix').innerHTML=`<span>￥${v.dataset.price}</span>
				(约${v.dataset.unitprice}元/次),仅限企业实名购买`
			}
		});
	});
	//默认的第一个添加在打开那里

	//功能给li弄相对应的内容
	//1.获取相关的节点
	// $('#document li').forEach(function(v,i){
	// 	//2.给li绑定点击事件
	// 	v.addEventListener('click',function(){
	// 		// console.log('111');
	// 		//排他.先清除他的样式
	// 		$('#document li').forEach(function(item,index){
	// 			item.classList.remove('active')
	// 			//3.点击过后通过索引显示对应的样式
	// 			$('#leftdoc div')
	// 				$('#leftdoc div')[index].classList.remove('on')
				
				
	// 		})
	// 		//排他过后添加样式
	// 		this.classList.add('active')	
	// 		$('#leftdoc div')[i].classList.add('on')

	// 	})
	// })
	tab('#document li', "active", '#leftdoc div', "on");









	const config = {
		selector: "#bannerBg",
		vx: 4, //点x轴速度,正为右，负为左
		vy: 4, //点y轴速度
		height: 2, //点高宽，其实为正方形，所以不宜太大
		width: 2,
		count: 100, //点个数
		color: "#000", //点颜色
		stroke: "0,0,0", //线条颜色
		dist: 6000, //点吸附距离
		e_dist: 20000, //鼠标吸附加速距离
		max_conn: 10, //点到点最大连接数
	};
	//调用
	CanvasParticle(config);
});
